<template>
	<view class="pages">
		<view class="statusbar"></view>

		<view>
			<piaoyiSwiper :list="recommend" :itemMargin="160" :autoplay="true" :interval="5000" :duration="1000" />

			<!-- <view>
				<view class="top">{{ $t('index1') }}</view>
				<shortlist :list="release" :top="3" />
			</view> -->

			<view v-for="item in categorys" :key="item.Name">
				<view class="top">{{ item.Name }}</view>
				<horizontal :list="item.series" />
			</view>

			<!-- <view>
				<view class="top">{{ $t('index5') }}</view>
				<shortlist :list="release" :top="3" />
			</view> -->
		</view>
	</view>
</template>

<script>
	import piaoyiSwiper from '@/components/piaoyi-swiper/piaoyi-swiper.vue'
	import horizontal from '@/components/horizontal.vue'
	import shortlist from '@/components/vertical.vue'

	import request from '@/common/request'

	export default {
		name: 'discover',
		components: {
			piaoyiSwiper,
			horizontal,
			shortlist
		},
		data() {
			return {
				titles: [],

				recommend: [],
				categorys: [],
				release: []
			}
		},
		async onLoad(option) {
			let userTmp1 = uni.getStorageSync('user')
			if (!userTmp1) {
				return
			}
			let userTmp = JSON.parse(userTmp1)
			const data = await request.get(`/emby/Users/${userTmp.userId}/Views`)
			let serverUrl = `${userTmp.serverip}:${userTmp.serverport}`
			if (!serverUrl.startsWith('http')) {
				serverUrl = `http://${serverUrl}`
			}
			let categorys = []
			for (const item of data.Items) {
				let imageStr = `${serverUrl}/emby/Items/${item.Id}/Images/Primary`
				item.cover = imageStr
				const detailData = await request.get(`/emby/Users/${userTmp.userId}/Items/Latest`, {
					Limit: 16,
					Fields: "BasicSyncInfo,CanDelete,PrimaryImageAspectRatio,ProductionYear",
					ImageTypeLimit: 1,
					EnableImageTypes: "Primary,Backdrop,Thumb",
					ParentId: item.Id
				})
				detailData.forEach(item1 => {
					let imageStr1 = `${serverUrl}/emby/Items/${item1.Id}/Images/Primary`
					item1.cover = imageStr1
				})
				categorys.push({
					Name: item.Name,
					series: detailData
				})
			}
		this.recommend = data.Items
		this.categorys = categorys
		// this.release = data.Items
	},
	methods: {}
	}
</script>

<style lang="scss" scoped>
	.top {
		font-size: 1.2rem;
		font-weight: bold;
		padding: 10px 0 10px;
	}
</style>